<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body class="dpflex fdc">
    <!-- 上面的部分 -->
    <main class="flex1">
        <!-- 头像部分的样式 -->
        <div class="headPhoto">
            <div class="head">
                <p class="mr16"></p>用户名
            </div>
            <p class="mt20">个性签名: <span id="mineText"></span> </p>
        </div>
        <!-- 运动数据 -->
        <div class="runNum mt20">
            <div class="dpflex jcsb exnum">
                <p><span class="iconfont icon-tiaoxingtu-xianxing"></span>运动数据</p>
                <span class="iconfont icon-xiayiyeqianjinchakangengduo"></span>
            </div>
            <div class="dpflex total mt20">
                <div>
                    <p>总运动</p>
                    <p><span>99</span>分钟</p>
                </div>
                <div class="consume">
                    <p>本周消耗</p>
                    <p><span>99</span>千卡</p>
                </div>
            </div>
        </div>
        <!-- 运动徽章 -->
        <div class="mt20 badge">
            <div class="dpflex jcsb exnum">
                <p><span class="iconfont icon-xunzhang"></span>运动数据</p>
                <span class="iconfont icon-xiayiyeqianjinchakangengduo"></span>
            </div>
            <!-- 下面图形 -->
            <ul class="badgeImg dpflex jcsa mt20">
               <li></li>
               <li></li>
               <li></li>
            </ul>
        </div>
        <!-- 退出登录 -->
        <div class="logOut mt20 mb16">退出登录</div>
    </main>
    <!-- 页脚部分 -->
    <footer class="footer">
        <div >
            <a href="./index.html">
                <i class="iconfont icon-31shouye"></i>
                <p> 首页</p>
            </a>
        </div>
        <div><a href="./personalData.html">
                <i class="iconfont icon-xintiaojiankangyundongyiliaobaohuxinshuai"></i>
                <p> 运动</p>
            </a>
        </div>
        <div class="active"><a href="./mine.html">
                <i class="iconfont icon-wode"></i>
                <p> 我的</p>
            </a>
        </div>
    </footer>
    
</body>

</html>